<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/common/common.css" />
	</head>

	<body>
		<div id="web">
			<div class="background1">
				<div class="progress">
					<img src="img/progress_bg.png" />
				</div>
				<div class="progress2 anim">
					<img src="img/progress_bar.jpg" />
					<div class="nengliang"></div>
				</div>
				<div class="bottle">
					<img src="img/big_pingzi.png" />
				</div>
				<div class="boom">
					<img src="img/boom.png" />
				</div>
				<div class="spark">
					<img src="img/huohua.png" />
				</div>
			</div>
		</div>

		<script type="text/javascript">
			if(window.DeviceMotionEvent) {
				window.addEventListener('devicemotion', deviceMotionHandler, false);
			}
				var SHAKE_THRESHOLD = 800;
				var last_update = 0;
				var x = y = z = last_x = last_y = last_z = 0;
				
				function deviceMotionHandler(eventData) {
					var acceleration = eventData.accelerationIncludingGravity;
					var curTime = new Date().getTime();
					var num = 0;
				
					if((curTime - last_update) > 100) {
						var diffTime = curTime - last_update;
						last_update = curTime;
						x = acceleration.x;
						y = acceleration.y;
						z = acceleration.z;
						var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
				
						if(speed > SHAKE_THRESHOLD){
							doResult();
						}
						last_x = x;
						last_y = y;
						last_z = z;
					}
				}

				var arr = ["result1.html","result2.html","result3.html","result4.html"];

					function doResult() {
					         var id = Math.ceil(Math.random()*3);
					         var res= arr[id];
					         var power = 0;
					         setInterval(function(){
					         	window.location.href = res;
					         },6000)
					}
					doResult()
			
				</script>

		<script type="text/javascript">
			document.body.style.height = window.innerHeight + "px";
				/*动态改变根元素字体大小*/
				function recalc() {
					var clientWidth = document.documentElement.clientWidth;
					if(!clientWidth) return;
					document.documentElement.style.fontSize = 40 * (clientWidth / 750) + 'px';
				}
				//字体大小 = 1rem单表示了多少个像素*设备的宽度
				
				function initRecalc() {
					recalc();
					var resizeEvt = 'osrientationchange' in window ? 'orientationchange' : 'resize';
					if(!document.addEventListener) return;
					window.addEventListener(resizeEvt, recalc, false);
					document.addEventListener('DOMContentLoaded', recalc, false);
				}
				initRecalc();
		</script>
	</body>

</html>